import React, { Component } from 'react';
import { connect } from 'dva';
import { routerRedux, Link } from 'dva/router';
import { Form, Input, Button, Radio, Cascader,message } from 'antd';
import areaData from '../area.json';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';

const { TextArea } = Input;
const FormItem = Form.Item;
const RadioGroup = Radio.Group;

@connect(({ user, loading }) => ({
  currentUser: user.currentUser,
}))
@Form.create()
export default class UserInfo extends Component {
  state = {
    count: 0,
    confirmDirty: false,
    visible: false,
    help: '',
  };

  onValidateForm = () => {
    const { form, dispatch } = this.props;
    form.validateFields((err, values) => {
      if (!err) {
        //console.log('asdfasdf');
        dispatch({
          type: 'user/modifyUserInfo',
          payload: values,
          callback: () => {
            message.success('个人信息修改成功')
          },
        });
      }
    });
  };

  idCardImgChange = fileList => {
    //console.log(fileList);
  };

  isCaipan = () => {
    const { form, dispatch } = this.props;
    if (form.getFieldValue('userRole') === 'cp') {
      return true;
    } else {
      return false;
    }
  };

  cpIdCardImgChange = fileList => {
    //console.log(fileList);
  };

  cascaderfilter = (inputValue, path) => {
    return path.some(option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
  };

  render() {
    const { form, currentUser } = this.props;
    const { getFieldDecorator } = form;

    const userAreaData = []
    userAreaData[0] = currentUser.province ;
    userAreaData[1] = currentUser.city;
    userAreaData[2] = currentUser.area;

    const validatorIDCard = (rule, code, callback) => {
      if(!code){
        callback()
        return;
      }
      code = code.split('');
      //∑(ai×Wi)(mod 11)
      //加权因子
      var factor = [ 7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2 ];
      //校验位
      var parity = [ 1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2 ];
      var sum = 0;
      var ai = 0;
      var wi = 0;
      for (var i = 0; i < 17; i++)
      {
          ai = code[i];
          wi = factor[i];
          sum += ai * wi;
      }
      var last = parity[sum % 11];
      if(parity[sum % 11] != code[17]){
        callback('身份证不合法!');
      }
      callback();
    };

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 12 },
        md: { span: 10 },
      },
    };

    return (
      <PageHeaderWrapper>
      <div style={{width:'50%', margin:'auto',marginTop:50}}>
        
        <Form hideRequiredMark layout='horizontal' >
          {getFieldDecorator('id', {
            rules: [
              {
                required: true,
              },
            ],
            initialValue: currentUser.id
          })(<Input type="hidden" size="large"/>)}
          <FormItem label="姓名" {...formItemLayout}>
            {getFieldDecorator('nickName', {
              rules: [
                {
                  required: true,
                  message: '请输入姓名！',
                },
              ],
              initialValue: currentUser.nickName
            })(<Input size="large" placeholder="您的姓名" />)}
          </FormItem>
          <FormItem label="身份证" {...formItemLayout}>
            {getFieldDecorator('idCard', {
              rules: [
                {
                  required: true,
                  message: '请输入身份证！',
                },
                {
                  validator: validatorIDCard,
                  message: '身份证不合法!',
                },
                {

                }
              ],
              initialValue: currentUser.idCard
            })(<Input size="large" placeholder="请输入身份证" />)}
          </FormItem>
          <FormItem label="所属地" {...formItemLayout}>
            {getFieldDecorator('areaData', {
              rules: [
                {
                  required: true,
                  message: '请选择省、市、区！',
                },
              ],
              initialValue:userAreaData
            })(
              <Cascader
                options={areaData}
                placeholder="Please select"
                //showSearch={this.cascaderfilter}
                placeholder="选择省份"
              />
            )}
          </FormItem>
          {/* <FormItem>
            {getFieldDecorator('idCardImg', {
              rules: [
                {
                  required: true,
                  message: '请上传身份证照片！',
                },
              ],
            })(<PicturesWall onChange={this.idCardImgChange} title="请上传身份证照片" />)}
          </FormItem> */}
          <FormItem label="个人简介" {...formItemLayout}>
            {getFieldDecorator('note', {
              rules: [],
              initialValue: currentUser.note
            })(
              <TextArea
                rows={5}
                size="large"
                placeholder="为了让别人更了解您，请输入您的个人简介"
              />
            )}
          </FormItem>
          <FormItem style={{textAlign:'center'}}>
            <Button
              size="large"
              type="primary"
              onClick={this.onValidateForm}
              
            >
              保存
            </Button>
          </FormItem>
        </Form>
      </div>
      </PageHeaderWrapper>
    );
  }
}
